<%--
   * 软件著作权：东方汇创
   *
   * 系统名称：xxx项目
   *
   * 文件名称：detailWorkflowNodeConfig.jsp
   *
   * 功能描述：前台工作流节点配置详细信息页面
   * 
   * 版本历史：
   * 2017-07-25   1.0.0版 （龙色波）（创建文件）
   * 
--%>

<%@page import="com.dfhc.wk.workflownodeconfig.IWorkflowNodeConfigConstants" %>
<%@page import="org.quickbundle.tools.helper.RmVoHelper" %>
<%@page import="org.quickbundle.tools.helper.RmStringHelper" %>
<%@page import="com.dfhc.wk.workflownodeconfig.vo.WorkflowNodeConfigVo" %>
<%@ page contentType="text/html; charset=UTF-8" language="java"%>

<!DOCTYPE html>
<html lang="en">
	<head>
	
	   <!-- 全局js 和css包 -->
	   <%@ include file="/jsp/include/web/jqGrid/global.jsp" %>
		<meta charset="utf-8" />
		<title><bean:message key="qb.web_title"/></title>

		<meta name="description" content="Dynamic tables and grids using jqGrid plugin" />
		<meta name="viewport" content="width=device-width, initial-scale=1.0" />


	</head>
	


	<body>
	
	
	

    <!-- begin 查询 -->
    
     <div class="ui-widget ui-widget-content ui-corner-all ui-jqdialog jqmID1 ui_inner_tan" id="portlet-config-query" dir="ltr" tabindex="-1" role="dialog" aria-labelledby="edithdgrid-table" aria-hidden="false" >
      <div class="ui-jqdialog-titlebar ui-widget-header ui-corner-all ui-helper-clearfix"  style="cursor: move;">
	   <span class="ui-jqdialog-title" style="float: left;">查询</span>
	   <a href="javascript:void(0)" class="cancel ui-jqdialog-titlebar-close ui-corner-all" style="right: 0.3em;">
	    <span class="ui-icon ui-icon-closethick"></span>
	   </a>
   </div>
   <div class="ui-jqdialog-content ui-widget-content" id="editcntgrid-table"><div>
   <div class="modal-body">
   <form name="form" id="form" class="FormGrid ui_inner_form" method="post" >
   
           <div class="control-group">
							<div class="controls">
							<input id="id" name="id" type="hidden" />
							<div class="input-prepend">
							  <span class="add-on"><%=IWorkflowNodeConfigConstants.TABLE_COLUMN_DISPLAY.get("name")%></span><input class="m-wrap" name="name" id="name" type="text"  />
							</div>
							<div class="input-prepend">
							  <span class="add-on"><%=IWorkflowNodeConfigConstants.TABLE_COLUMN_DISPLAY.get("remark")%></span><input class="m-wrap" name="remark" id="remark" type="text"  />
							</div>
							<div class="input-prepend">
							  <span class="add-on"><%=IWorkflowNodeConfigConstants.TABLE_COLUMN_DISPLAY.get("nodeType")%></span><input class="m-wrap" name="nodeType" id="nodeType" type="text"  />
							</div>
							<div class="input-prepend">
							  <span class="add-on"><%=IWorkflowNodeConfigConstants.TABLE_COLUMN_DISPLAY.get("showType")%></span><input class="m-wrap" name="showType" id="showType" type="text"  />
							</div>
							<div class="input-prepend">
							  <span class="add-on"><%=IWorkflowNodeConfigConstants.TABLE_COLUMN_DISPLAY.get("nodeIcon")%></span><input class="m-wrap" name="nodeIcon" id="nodeIcon" type="text"  />
							</div>
							<div class="input-prepend">
							  <span class="add-on"><%=IWorkflowNodeConfigConstants.TABLE_COLUMN_DISPLAY.get("nodeStyle")%></span><input class="m-wrap" name="nodeStyle" id="nodeStyle" type="text"  />
							</div>
							</div>
			 </div>
     
     </form>
     </div>
     
     <div class="EditTable operate_div" >
       <a href="javascript:void(0)" id="sData" class="fm-button ui-state-default ui-corner-all fm-button-icon-left" onclick="javascript:searchShi($(form).serialize());">
       <i class="icon-search"></i>
           查询</a>
       <a href="javascript:void(0)" id="cData" class="cancel fm-button ui-state-default ui-corner-all fm-button-icon-left">
      <i class="icon-remove"></i> 
              取消</a>
     </div>
   
     </div></div>
     
     </div>
     
    
    
    <!-- end 查询 -->
 
   <%@ include file="/jsp/include/web/jqGrid/rightTop.jsp"%>

					<div class="page-content">

		                <!-- begin  详情 -->
		                
		                 <div class="widget-box">
		                 
		                     <div class="widget-header">
		                      
		                      <h5>前台工作流节点配置详情</h5>
		                      <div class="widget-toolbar">
		                      		                         
		                         <a href="<%=request.getContextPath()%>/workflownodeconfig" title="返回">
		                         
		                           <i class="icon-share-alt"></i>
		                           
		                         </a>
		                      
		                      </div>
		                         
		                      
		                     </div>
		                     <!-- end  header -->
		                     
		                     <!-- begin  -->
		                     
		                     <div class="widget-body">
		                     
		                       <div class="widget-main">
		                       
		                         <table  class="table table-striped table-bordered table-hover detail-tab">
		                         
			                         <tbody>
	                  			          <tr>
			                             <th><%=IWorkflowNodeConfigConstants.TABLE_COLUMN_DISPLAY.get("name")%>:</th>
			                             <td>${workflowNodeConfigVo.name}</td>
			                             <th><%=IWorkflowNodeConfigConstants.TABLE_COLUMN_DISPLAY.get("remark")%>:</th>
			                             <td>${workflowNodeConfigVo.remark}</td>
			                             <th><%=IWorkflowNodeConfigConstants.TABLE_COLUMN_DISPLAY.get("nodeType")%>:</th>
			                             <td>${workflowNodeConfigVo.nodeType}</td>
	                  			          </tr>
	                  			          <tr>
			                             <th><%=IWorkflowNodeConfigConstants.TABLE_COLUMN_DISPLAY.get("showType")%>:</th>
			                             <td>${workflowNodeConfigVo.showType}</td>
			                             <th><%=IWorkflowNodeConfigConstants.TABLE_COLUMN_DISPLAY.get("nodeIcon")%>:</th>
			                             <td>${workflowNodeConfigVo.nodeIcon}</td>
			                             <th><%=IWorkflowNodeConfigConstants.TABLE_COLUMN_DISPLAY.get("nodeStyle")%>:</th>
			                             <td>${workflowNodeConfigVo.nodeStyle}</td>
	                  			          </tr>
			                         </tbody>
		                      
		                         
		                         </table>
					  <div class="row" style="height: 300px;">
								<div class="col-xs-12">
									<!-- PAGE CONTENT BEGINS -->
	
									<table id="grid-table"></table>
	
									<div id="grid-pager"></div>
	
									<script type="text/javascript">
										var $path_base = "/";//this will be used in gritter alerts containing images
									</script>
	
									<!-- PAGE CONTENT ENDS -->
								</div><!-- /.col -->
							</div><!-- /.row -->		                       
		                       </div>
		                     
		                     
		                     </div>
		                     
		                     <!-- end  -->
		                 
		                 
		                 </div>
		
		                   
				<!-- end 详情 -->
				</div><!-- /.page-content -->
<script type="text/javascript">
			//var grid_data = ${grid_data};	
		
			jQuery(function($) {
				var grid_selector = "#grid-table";
				var pager_selector = "#grid-pager";

				jQuery(grid_selector).jqGrid({
					//direction: "rtl",
					
					url: getRootPath()+'/wk/nodeproperty/ajaxList?workflowNodeConfigId=${workflowNodeConfigVo.id}',
					datatype: "json",
				    mtype: 'POST',  
					height: '100%',
					colNames:[
'<%=INodePropertyConstants.TABLE_COLUMN_DISPLAY.get("workflowNodeConfigId")%>'
,'<%=INodePropertyConstants.TABLE_COLUMN_DISPLAY.get("attributeChineseName")%>'
,'<%=INodePropertyConstants.TABLE_COLUMN_DISPLAY.get("attributeEnglishName")%>'
,'<%=INodePropertyConstants.TABLE_COLUMN_DISPLAY.get("controlType")%>'
,'<%=INodePropertyConstants.TABLE_COLUMN_DISPLAY.get("controlContent")%>'
,'<%=INodePropertyConstants.TABLE_COLUMN_DISPLAY.get("remark")%>'
],
					colModel:[
			{name:'workflowNodeConfigId',index:'workflowNodeConfigId', width:90,editable: true,editoptions:{size:"20",maxLength:"19"}},
			{name:'attributeChineseName',index:'attributeChineseName', width:90,editable: true,editoptions:{size:"20",maxLength:"255"}},
			{name:'attributeEnglishName',index:'attributeEnglishName', width:90,editable: true,editoptions:{size:"20",maxLength:"255"}},
			{name:'controlType',index:'controlType', width:90,editable: true,editoptions:{size:"20",maxLength:"2"}},
			{name:'controlContent',index:'controlContent', width:90,editable: true,editoptions:{size:"20"}},
			{name:'remark',index:'remark', width:90,editable: true,editoptions:{size:"20",maxLength:"255"}}
], 
			                shrinkToFit:false,//不随列数量改变列宽度
					viewrecords : true,
					rownumbers:true,
					rowNum:15,
					rowList:[15,30],
					pager : pager_selector,
					sortname : 'id',//初始化的时候排序的字段
					sortorder : "desc",//排序方式,可选desc,asc
					altRows: true,
					//toppager: true,
					
					multiselect: true,
					//multikey: "ctrlKey",
			        multiboxonly: true,
			
					loadComplete : function() {
						var table = this;
					        //调整表头checkbox位置
						$('#cb_grid-table').css("margin-top","-6px");
						$('#cb_grid-table').css("margin-left","4px");

						setTimeout(function(){
							
							
							updateActionIcons(table);
							updatePagerIcons(table);
							enableTooltips(table);
						}, 0);
					},
			
					editurl: getRootPath()+'/nodeproperty/update',//nothing is saved
					caption: "明细列表展示",
					autowidth: true
			
				});
				
				//enable search/filter toolbar
				//jQuery(grid_selector).jqGrid('filterToolbar',{defaultSearch:true,stringResult:true})
			
			
				//navButtons
				jQuery(grid_selector).jqGrid('navGrid',pager_selector,
					{ 	//navbar options
						edit: false,
						editicon : 'icon-pencil blue',
						add: false,
						addicon : 'icon-plus-sign purple',
						del: false,
						delicon : 'icon-trash red',
						search: false,
						searchicon : 'icon-search orange',
						refresh: false,
						refreshicon : 'icon-refresh green',
						view: false,
						viewicon : 'icon-zoom-in grey',
					
					}
				)
				
				
				//查询
				  jQuery(grid_selector) .navButtonAdd(pager_selector,
					{ caption:"",title:"查询", buttonicon:"icon-search orange",
				      onClickButton:search_div , 
				      position:"last" }) ;
                //查询层
			     
			     function search_div(){
			    	 $(".ui_out_tan").show();
			    	 $("#portlet-config-query").show();
			     }
			     
				//unlike navButtons icons, action icons in rows seem to be hard-coded
				//you can change them like this in here if you want
				function updateActionIcons(table) {
					/**
					var replacement = 
					{
						'ui-icon-pencil' : 'icon-pencil blue',
						'ui-icon-trash' : 'icon-trash red',
						'ui-icon-disk' : 'icon-ok green',
						'ui-icon-cancel' : 'icon-remove red'
					};
					$(table).find('.ui-pg-div span.ui-icon').each(function(){
						var icon = $(this);
						var $class = $.trim(icon.attr('class').replace('ui-icon', ''));
						if($class in replacement) icon.attr('class', 'ui-icon '+replacement[$class]);
					})
					*/
				}
				
				//replace icons with FontAwesome icons like above
				function updatePagerIcons(table) {
					var replacement = 
					{
						'ui-icon-seek-first' : 'icon-double-angle-left bigger-140',
						'ui-icon-seek-prev' : 'icon-angle-left bigger-140',
						'ui-icon-seek-next' : 'icon-angle-right bigger-140',
						'ui-icon-seek-end' : 'icon-double-angle-right bigger-140'
					};
					$('.ui-pg-table:not(.navtable) > tbody > tr > .ui-pg-button > .ui-icon').each(function(){
						var icon = $(this);
						var $class = $.trim(icon.attr('class').replace('ui-icon', ''));
						
						if($class in replacement) icon.attr('class', 'ui-icon '+replacement[$class]);
					})
				}
			
				function enableTooltips(table) {
					$('.navtable .ui-pg-button').tooltip({containeshowDater:'body'});
					$(table).find('.ui-pg-div').tooltip({container:'body'});
				}
			
				//var selr = jQuery(grid_selector).jqGrid('getGridParam','selrow');
			
			
			});
		</script>		
	</body>
</html>
